:root:root{
    --el-border-radius-small: 3px;
    --el-border-radius-base: 6px;
    --el-border-radius-large: 12px;
    --el-border-radius-round: 999px;
    --el-border-radius-circle: 50%;

    --el-menu-item-height:43px !important;

    --el-table-th-bg:#fafafa;
    --el-table-th-color:rgba(0, 0, 0, 0.88);


    --theme-light-el-menu-hover-bg: var(--el-color-primary-light-9);
    --theme-light-el-menu-text-color: var(--el-color-primary);

    --el-input-bg: rgba(243, 243, 243, .76);
    --el-input-bg-hover:rgb(228, 228, 228) ;
    --el-input-bg-active: rgb(215, 215, 215);
    --el-input-boxshadow: 0px 1px 2px rgba(0, 0, 0, .1);

    --el-card-padding: 15px 20px;

    --gray-100: #f9f9f9;
    --gray-100-rgb: 249, 249, 249;
    --gray-200: #f1f1f4;
    --gray-200-rgb: 241, 241, 244;
    --gray-300: #dbdfe9;
    --gray-300-rgb: 219, 223, 233;
    --gray-400: #c4cada;
    --gray-400-rgb: 196, 202, 218;
    --gray-500: #99a1b7;
    --gray-500-rgb: 153, 161, 183;
    --gray-600: #78829d;
    --gray-600-rgb: 120, 130, 157;
    --gray-700: #4b5675;
    --gray-700-rgb: 75, 86, 117;
    --gray-800: #252f4a;
    --gray-800-rgb: 37, 47, 74;
    --gray-900: #071437;
    --gray-900-rgb: 7, 20, 55;
    &.dark{
        --el-table-th-bg:#1d1d1d;
        --el-table-th-color:rgba(255, 255, 255, 0.85);

        --theme-light-el-menu-hover-bg:hsl(216 5% 19%);
        --theme-light-el-menu-text-color: hsl(0 0% 95%);

        --el-input-bg:#2f313b;
        --el-input-bg-hover: #3c3e4b;
        --el-input-bg-active: #1d1d26;
        --el-input-boxshadow: 0px 1px 2px rgba(0, 0, 0, .1);

        --gray-100: #1b1c22;
        --gray-100-rgb: 27, 28, 34;
        --gray-200: #26272f;
        --gray-200-rgb: 38, 39, 47;
        --gray-300: #363843;
        --gray-300-rgb: 54, 56, 67;
        --gray-400: #464852;
        --gray-400-rgb: 70, 72, 82;
        --gray-500: #636674;
        --gray-500-rgb: 99, 102, 116;
        --gray-600: #808290;
        --gray-600-rgb: 128, 130, 144;
        --gray-700: #9a9cae;
        --gray-700-rgb: 154, 156, 174;
        --gray-800: #b5b7c8;
        --gray-800-rgb: 181, 183, 200;
        --gray-900: #f5f5f5;
        --gray-900-rgb: 245, 245, 245;
    }
}

.dialog-fade-enter-active {
    .el-dialog {
        animation: dialog-open 0.3s cubic-bezier(0.32, 0.14, 0.15, 0.86);
    }
}

.dialog-fade-leave-active {
    animation: fade-out 0.2s linear;

    .el-dialog {
        animation: dialog-close 0.2s cubic-bezier(0.78, 0.14, 0.15, 0.86);
    }
}

@keyframes dialog-open {
    0% {
        opacity: 0;
        transform: scale(0.2);
    }

    100% {
        opacity: 1;
        transform: scale(1);
    }
}

@keyframes dialog-close {
    0% {
        opacity: 1;
        transform: scale(1);
    }

    100% {
        opacity: 0;
        transform: scale(0.2);
    }
}

@keyframes fade-out {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}


.el-button > span {
    position: relative;
    z-index: 10;
}
.el-button.is-loading{
    border:none !important;
}


.el-message__content{
    color: #666 !important;
}

.el-dialog.is-fullscreen{
    width: 100% !important;
    .el-dialog__body{
        max-height: 90% !important;
    }
}
